import React from 'react';
import CommonHeader from 'COMPONENT/CommonHeader';
import './index.less';
import PropTypes from 'prop-types';

import { Button,List,InputItem,Picker,WhiteSpace  } from 'antd-mobile';
const seasons = [
  	{value:'上海市浦东新区',label:'上海市浦东新区'},
  	{value:'上海市普陀区',label:'上海市普陀区'},
  	{value:'上海市闵行区',label:'上海市闵行区'}
  	
  
]

const ListItem = List.Item;
export default class MyLoanAdd extends React.Component {
	static contextTypes = {
    router: PropTypes.object.isRequired
  }
  constructor(props) {
    super(props);
    this.state={ 
        area:'100',
        position:seasons[0]['label'],
        address:'淞南三村99号101',
        money:'123412.00',
    }
  }

  componentDidMount(){

  }
  
  onMonthsChange = (val, data) => {
	    let colNum = 1;
	    const d = [...this.state.byStagesData];
    	const asyncValue = [...val];
	    this.setState({
	      data: d,
	      qishuChecked: val,
	      cols: colNum,
	      asyncValue,
	    });
	};

  getData = () =>{ 
    this.context.router.push({
			pathname: '/houseLoan'
    })
    localStorage.setItem('LoanMessage',JSON.stringify(this.state));
  }

  render(){
    return(
      <div className='my_loan_add_body'>
				<CommonHeader 
					name='房抵贷申请'					
					leftContentTitle="@back" 
					leftContent='返回'				
				/>
				<div style={{height:'.9rem'}}></div>
      
        <div className='my_loan_add_body_title'>请输入您要抵押的房产信息</div>
        <List>
            <Picker
              title="区域"
              extra={this.state.position}
							cols="1"  

              data={seasons}
              onChange={v => this.setState({ position: v })}
              onOk={v => this.setState({ position: v })}
            ><ListItem arrow="horizontal">区域</ListItem>
            </Picker>
            <InputItem
              placeholder="淞南三村99号101"
              clear
              moneyKeyboardAlign="left"
              onChange={i => {this.setState({address:i});}}
              // moneyKeyboardWrapProps={moneyKeyboardWrapProps}
            >详细地址</InputItem>
            <InputItem
              placeholder="100"
              clear
              type="digit"
              moneyKeyboardAlign="left"
              
              onChange={i => {this.setState({area:i});}}
              // moneyKeyboardWrapProps={moneyKeyboardWrapProps}
            >房屋面积(m²)</InputItem>
        </List>
          <WhiteSpace size="lg" />
          <div className="btnGroup-one">
              <Button type="primary" className="btnGroup-one-btn"
                      onClick={() => this.getData()}>下一步</Button>
          </div>
      </div>
    )
  }
}
